<template>
    <div class="lgp_app" style="">
        <el-form ref="form" :model="form" label-width="100px">


            <el-form-item label="直播链接">
                <el-input v-model="form.target" placeholder="支持输入淘口令格式：￥XXXXX￥"></el-input>
            </el-form-item>
            <el-row >
                <el-col :lg="8">
                    <el-form-item label="每天发布量">
                        <el-input v-model="form.count"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :lg="8">
                    <el-form-item label="点赞">
                        <el-input v-model="form.like"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-form-item label="直播id">
                <el-col :lg="24">
                    <el-input v-model="form.keyword"></el-input>
                </el-col>
            </el-form-item>
            <el-form-item label="发布天数">
                <el-row :gutter="10">
                    <el-col :lg="5">
                        <el-input v-model="form.send_day"></el-input>
                    </el-col>
                    <el-col :lg="8">
                        <el-button type="primary" @click="cilck1">7天</el-button>
                        <el-button type="primary" @click="cilck2">15天</el-button>
                        <el-button type="primary" @click="cilck3">30天</el-button>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item label="开始时间">
                <el-date-picker type="date" placeholder="选择日期" v-model="form.begin_time"
                                style="width: 20%;"></el-date-picker>
            </el-form-item>
            <el-form-item label="备注">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">发布任务</el-button>
                <el-button>取消</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
  import { tb_zb } from '@/api/taobao'

  const field = {
    hour: Array(24)
  }
  export default {
    data() {
      return {
        form: {
          count: 100,
          like: '',
          send_day: 1,
          begin_time: '',
          keyword: '',
          field: [field]
        }
      }
    },
    methods: {
      onSubmit() {
        for (var a in this.form.field) {
          var obj = this.form.field[a].hour.join(',')
        }
        const all = Object.assign(this.form.field[a], this.form)
        tb_zb({
          send_day: all.send_day,
          begin_time: all.begin_time,
          count: all.field[a].count,
          keyword: all.field[a].keyword,
          hour: obj,
          sign: '9f362d02637043d95610178930540c'
        }).then(response => {
          console.log(response)
        }).catch(
          function(error) {
            console.log(error)
          }
        )
      },
      add_field() {
        this.form.field.push({
          count: 100,
          show: 100,
          keyword: 100,
          hour: Array(24)
        })
      },
      del_field(i) {
        if (i) {
          this.form.field.splice(i, 1)
        }
      },
      cilck1() {
        this.form.send_day = 7
      },
      cilck2() {
        this.form.send_day = 15
      },
      cilck3() {
        this.form.send_day = 30
      }
    }
  }
</script>
<style>
    .lgp_app {
        padding: 0 20px;
    }

    .split_time {
        line-height: 25px;
        border: 1px solid #409EFF;
        margin-bottom: 10px;
        border-radius: 12px;
    }

    .time_split_title {
        text-align: center;
        display: inline-block;
        width: 100%;
        border: 1px solid #cccccc;
        background-color: #409EFF;
        color: #ffffff;
        height: 25px;
        border-radius: 12px 12px 0 0;
        margin-bottom: 0;
        vertical-align: text-bottom;
        padding-bottom: 0;
    }

    .split_time_input input {
        padding: 0 6px;
        border: 0;
        height: 15px;
        border-radius: 0 0 12px 12px;
        text-align: center;
    }


</style>
